<template>
    <div class="Income">
        <!-- 收益/提现 -->
		<!-- 面包屑导航区域 -->
		<el-breadcrumb separator-class="el-icon-arrow-right">
			<el-breadcrumb-item>当前位置：收益/提现</el-breadcrumb-item>
			<el-breadcrumb-item>{{location}}</el-breadcrumb-item>
		</el-breadcrumb>
		<el-container>
			<!-- 左侧边栏 -->
			<el-aside width="200px">
				
				<router-link v-for="(item,index) in asideNavs" :key="index" :to="item.path" class="userAsideItem">
					<div @click="qiehuan(item)">
						<i></i>
						<span>{{item.name}}</span>
					</div>
				</router-link>
				
			</el-aside>
			<el-main>
				<!-- 卡片内容 -->
				<el-card class="box-card">
					<router-view/>
				</el-card>
			</el-main>
		</el-container>
    </div>
</template>

<script>
	export default {
		name:'Income',
		data(){
			return{
				location:'',
				asideNavs:[]
			}
		},
		methods:{
			qiehuan(item){
				this.location = item.name;
			}
		},
		created () {
			var isAdimn = window.atob(this.$cookie.get('isAdimn'));
			if(isAdimn == 'false'){
				this.location = '收益';
				this.asideNavs = [
					{path:'/Income/Earnings',name:'收益'},
					{path:'/Income/Record',name:'提现记录'}
				]
				this.$router.push('/Income/Earnings').catch(err => {err})
			}else if(isAdimn == 'true'){
				this.location = '提现记录';
				this.asideNavs = [
					{path:'/Income/Record',name:'提现记录'}
				]
				this.$router.push('/Income/Record').catch(err => {err})
			}
		}
	}
</script>

<style scoped>
	.el-aside{
		height:calc(100vh - 100px);
		background-color:rgb(38,50,56);
		padding-top: 20px;
	}
    .el-breadcrumb{
      height: 40px;
      font-size: 14px;
      color: #808185;
      line-height: 40px;
      padding-left: 20px;
      background-color: #fff;
    }
	/* 内容 */
	.el-main{
		padding: 0;
		margin-top: 20px;
	}
	.box-card{
		margin: 0 10px;
	}
	
	/*  nav */
	.userAsideItem{
	    height: 40px;
	    line-height: 36px;
	    margin: 16px 0;
	    display: block;
	    color: #fff;
	    text-decoration: none;
	}
	.userAsideItem i{
	    width: 16px;
	    height: 16px;
	    vertical-align: middle;
	    margin: 0 10px 0 26px;
	}
	.userAsideItem span{
	    font-size: 16px;
	    vertical-align: middle;
	}
	
	.router-link-active{
	    height: 40px;
	    background-color: #000;
	    color: #fff;
	    border-left: 4px solid #2ad198;
	    line-height: 36px;
	    margin: 16px 0;
	    display: block;
	    text-decoration: none;
	}
	.router-link-active i{
	    width: 16px;
	    height: 16px;
	    vertical-align: middle;
	    margin: 0 10px 0 22px;
	}
	.router-link-active span{
	    font-size: 16px;
	    vertical-align: middle;
	}
	
</style>